import React from "react";
import { TMap } from '@map-component/react-tmap';


const Contact = () => {
    const back = () => {
        React.navigate(-1)
    }
    const swiperList = [
        "/assets/images/hotel1.jpg",
        "/assets/images/hotel2.jpg",
        "/assets/images/hotel3.jpg"
    ]
   
    return (
        <>
            <link rel="stylesheet" href="/assets/css/hotel-info.css" />
            {/* 导航  */}
            <React.UI.NavBar
            onBack={back}
            style={{ background: `rgb(55, 68, 134)`, color: '#fff' }}
        >
            门店详情
        </React.UI.NavBar>
            {/* <!-- 轮播 --> */}
            <React.UI.Swiper loop autoplay style={{ height: "213px" }}>
                {
                    swiperList.map((item, index) => {
                        return (
                            <React.UI.Swiper.Item key={index}>
                                <img src={item} alt="" />
                            </React.UI.Swiper.Item>
                        )
                    })
                }
            </React.UI.Swiper>

            <div className="hotelinfo">
                <div className="hotelinfo_title">
                    创想第一门店
                </div>
                <div className="hotelinfo_address">
                    广东省深圳市福田区华强北街道振兴路341号上步工业区
                </div>
                {/* <div className="map" id="map"> */}
                {/* </div> */}
                <TMap
                    mapKey="ZPMBZ-BWI3M-PP56L-66XNR-E7JYV-44B72"
                    version='1.exp'
                    center={{ lat: 23.166259, lng: 113.240714 }}
                >
                </TMap>
                <div className="hotelinfo_desc">
                    <div className="desc_title">简介</div>
                    <div>这里是极速创想第一门店</div>
                </div>
                <div className="hotelinfo_desc">
                    <div className="desc_title">详情</div>
                    <div>这里是极速创想第一门店，欢迎你的预订入住</div>
                </div>
            </div>
        </>
    )

}




export default Contact